<template>
	<view>
		<navTop title="管理社团" :isHeight="false" hasBgc="white" :color="navtop.color" :isBack="true"></navTop>
		<view>
			<image :src="src" class="headImg"></image>
			<view class="title">
				<view class="titleText">{{AsscotionData.name}}</view>
			</view>
		</view>
		<view>
			<view class="card1" @click="toChange()">修改社团信息</view>
			<view class="card2" @click="toMember()">查看社团成员</view>
			<view class="card3" @click="gonggao()">修改社团公告</view>
			<view class="card4" @click="toUploadImg()">上传相册图片</view>
			<view class="card5" @click="dismissAssiciotion()">解散社团</view>
		</view>
	</view>
</template>

<script>
	import navTop from '../../components/navTop.vue'
	import associationCard_manage from '../../components/associationCard_manage.vue'
	export default {
		components: {
			navTop,
			associationCard_manage
		},
		data() {
			return {
				navtop: {
					title: 'XXX',
					color: '#000000'
				},
				imgUrl: 'https://www.codingyt.com/getImage/',
				src: '',
				AsscotionData: {},
			}
		},
		onLoad(val) {
			let data = JSON.parse(val.content)
			this.AsscotionData = data
			if(this.AsscotionData.img_id!=undefined){
				this.src = this.imgUrl + data.img_id;
			}else{
				this.src = this.imgUrl + data.imgId;
			}
			
		},
		methods: {
			dismissAssiciotion(){
				uni.showModal({
					title: '你确定要解散社团吗',
					success: function(res) {
						if (res.confirm) {
							uni.request({
								url:'https://www.codingyt.com/club/organization/delete',
								data:{
									id:that.AsscotionData.id,
								},
								method:'POST',
								success(res) {
									
								}
							})
							
						} else if (res.cancel) {
							
						}
					}
				});
			},
			
			//将这个公告和我们的社团字段绑定到一起 到时候可以进行展示我们的公告信息处理进行循环播放 数据库当中需要多一个字段进去
			//
			gonggao() {
				let that=this
				uni.showModal({
					title: '修改社团公告',
					editable: true,
					placeholderText: '请输入社团公告',
					success: function(res) {
						if (res.confirm) {
							uni.request({
								url:'https://www.codingyt.com/club/organization/update',
								data:{
									id:that.AsscotionData.id,
									announcement:data
								},
								method:'POST',
								success(res) {
									
								}
							})
							
						} else if (res.cancel) {
							
						}
					}
				});
			},
			toChange() {
				//取到我们的修改我们的社团的成员的用户的信息已完成
				uni.navigateTo({
					url: './changeAssociationData?content='+JSON.stringify(this.AsscotionData)
				})
			},
			toMember() {
				// 记得传参
				let that = this;
				let data=[]
				uni.request({
					url: 'https://www.codingyt.com/club/userOrganization/select',
					data: {
						organizationId: that.AsscotionData.id,
					},
					success(res) {
						data=res.data.data
						uni.navigateTo({
							url: './asoMemberMore?content='+JSON.stringify(data)
						})
					}
				})
				
			},
			//这个是上传多组照片的功能
			toUploadImg() {
				
				uni.navigateTo({
					url: './uploadImg?content='+JSON.stringify(this.AsscotionData)
				})
			}
		},
		onShow() {
			
		}

	}
</script>

<style scoped>
	.headImg {
		left: 286rpx;
		top: 232rpx;
		width: 180rpx;
		height: 180rpx;
		border-radius: 112rpx;
		position: absolute;
	}

	.title {
		top: 466rpx;
		width: 750rpx;
		height: 58rpx;
		color: rgba(16, 16, 16, 100);
		font-size: 40rpx;
		  ;
		position: absolute;
	}

	.titleText {
		text-align: center;
	}

	.card1 {
		left: 114rpx;
		top: 592rpx;
		width: 526rpx;
		height: 146rpx;
		border-radius: 46rpx;
		background-color: rgba(249, 193, 110, 100);
		color: rgba(255, 255, 255, 100);
		font-size: 48rpx;
		line-height: 142rpx;
		text-align: center;
		font-family: Microsoft Yahei;
		border: 2rpx solid rgba(187, 187, 187, 100);
		position: absolute;
	}

	.card2 {
		left: 114rpx;
		top: 806rpx;
		width: 526rpx;
		height: 146rpx;
		border-radius: 46rpx;
		background-color: rgba(249, 193, 110, 100);
		color: rgba(255, 255, 255, 100);
		font-size: 48rpx;
		line-height: 142rpx;
		text-align: center;
		font-family: Microsoft Yahei;
		border: 2rpx solid rgba(187, 187, 187, 100);
		position: absolute;
	}

	.card3 {
		left: 114rpx;
		top: 1020rpx;
		width: 526rpx;
		height: 146rpx;
		border-radius: 46rpx;
		background-color: rgba(249, 193, 110, 100);
		color: rgba(255, 255, 255, 100);
		font-size: 48rpx;
		line-height: 142rpx;
		text-align: center;
		font-family: Microsoft Yahei;
		border: 2rpx solid rgba(187, 187, 187, 100);
		position: absolute;
	}

	.card4 {
		left: 114rpx;
		top: 1234rpx;
		width: 526rpx;
		height: 146rpx;
		border-radius: 46rpx;
		background-color: rgba(249, 193, 110, 100);
		color: rgba(255, 255, 255, 100);
		font-size: 48rpx;
		line-height: 142rpx;
		text-align: center;
		font-family: Microsoft Yahei;
		border: 2rpx solid rgba(187, 187, 187, 100);
		position: absolute;
	}
	
	.card5{
		left: 114rpx;
		top: 1434rpx;
		width: 526rpx;
		height: 146rpx;
		border-radius: 46rpx;
		background-color: rgba(255, 0, 0, 1);
		color: rgba(255, 255, 255, 100);
		font-size: 48rpx;
		line-height: 142rpx;
		text-align: center;
		font-family: Microsoft Yahei;
		border: 2rpx solid rgba(187, 187, 187, 100);
		position: absolute;
	}
</style>
